body, html {
    font-family: Arial, Helvetica, sans-serif;
    
    
}

#pealkiri {
    font-size: 24px;
    padding-top: 30px;
    padding-bottom: 30px;
    color: white;
}

#alapealkiri {
    text-align: center;
    color: darkorange;
    font-size: 16px;
}

p {
    font-size: 18px;
}

.diilid-jaotis {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    padding: 20px 0;
}

.diil {
    background-color: #f3f3f3;
    padding: 15px;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.diil:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}


.conteiner {
    width: 80%;
    margin: 0 auto; /* This centers the container */
    text-align: center;
}

image {
    display: block;
    width: 200px;  /* The width you desire for your image */
    height: 180px;  /* This will keep the aspect ratio of your image */
    margin: 0 auto;  /* This will center your image horizontally */
    position: absolute;  /* Position your image absolutely within its container */
    left: 0;  /* Align left edge of the image to the left edge of its container */
    right: 0;  /* Align right edge of the image to the right edge of its container */
    bottom: 0;  
}